@syncfusion/ej2-inputs

What is @syncfusion/ej2-inputs?

@syncfusion/ej2-inputs is a comprehensive package that provides a variety of input controls for building modern web applications. It includes components like TextBox, NumericTextBox, MaskedTextBox, Slider, and more, which are essential for creating interactive and user-friendly forms.

What are @syncfusion/ej2-inputs's main functionalities?

TextBox

The TextBox component allows users to input text. It supports various configurations like placeholder text, floating labels, and more.

import { TextBox } from '@syncfusion/ej2-inputs';

let textBoxObj = new TextBox({
    placeholder: 'Enter your name'
});
textBoxObj.appendTo('#textbox');

NumericTextBox

The NumericTextBox component is used for numerical input. It supports features like min/max values, step increments, and custom formatting.

import { NumericTextBox } from '@syncfusion/ej2-inputs';

let numericTextBoxObj = new NumericTextBox({
    value: 10,
    min: 0,
    max: 100,
    format: 'n2'
});
numericTextBoxObj.appendTo('#numerictextbox');

MaskedTextBox

The MaskedTextBox component allows users to input text in a specific format, such as phone numbers or dates, using a mask pattern.

import { MaskedTextBox } from '@syncfusion/ej2-inputs';

let maskedTextBoxObj = new MaskedTextBox({
    mask: '000-000-0000'
});
maskedTextBoxObj.appendTo('#maskedtextbox');

Slider

The Slider component is used for selecting a value from a range. It supports features like min/max values, step increments, and orientation.

import { Slider } from '@syncfusion/ej2-inputs';

let sliderObj = new Slider({
    value: 30,
    min: 0,
    max: 100,
    step: 1
});
sliderObj.appendTo('#slider');

Other packages similar to @syncfusion/ej2-inputs

react-inputs-validation

react-inputs-validation is a package that provides a set of input components with built-in validation for React applications. It offers similar functionalities like text input, numeric input, and masked input, but is specifically designed for React.

react-number-format

react-number-format is a React component for formatting and masking numeric inputs. It provides features like custom formatting, masking, and validation, similar to the NumericTextBox and MaskedTextBox components in @syncfusion/ej2-inputs.

rc-slider

rc-slider is a React component for creating sliders. It offers similar functionalities to the Slider component in @syncfusion/ej2-inputs, including support for range selection, step increments, and custom styling.

README

A package of Essential JS 2 Input textbox components. It comes with full support and is available under commercial and community licenses – please visit www.syncfusion.com to get started.

Resources

• NumericTextBoxes Demos
• TextBox Demos
• MaskedTextBox Demos

Changelog

Check the changelog here